<template>
  <div class="order-details">
    <a-form :form="certificationsForm">
      <template>
        <div class="title">认证人员</div>
        <a-row >
          <a-col :span="24">
            <a-row :gutter="12">
              <a-col :span="4">
                <a-form-item>
                  <a-input
                    maxLength="10"
                    readOnly
                    v-decorator="[
                      'zkxm',{
                        rules: [{
                          message: '请输入正确的姓名'
                        }],
                        initialValue: tenantInfo.zkxm
                      }
                    ]"
                    placeholder="姓名"></a-input>
                </a-form-item>
              </a-col>
              <a-col :span="5">
                <a-form-item>
                  <a-select
                    placeholder="证件类型"
                    v-decorator="[
                      'zjzl',{
                        rules: [{
                          required: true,
                          message: '请选择证件种类'
                        }],
                        initialValue: '1'
                      }
                    ]">
                    <a-select-option value="1">二代身份证</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="14">
                <a-form-item>
                  <a-row :gutter="12">
                    <a-col :span="12">
                      <a-input
                        maxLength="18"
                        v-decorator="[
                          'zjhm',{
                            rules: [{
                              required: true,
                              message: '请输入正确的证件号码',
                              pattern: cardIdReg
                            }],
                            initialValue: tenantInfo.zjhm,
                            validateFirst:true
                          }
                        ]"
                        placeholder="证件号码"></a-input>
                    </a-col>
                  </a-row>
                </a-form-item>
              </a-col>
            </a-row>
          </a-col>
        </a-row>
        <div class="title pad_top28 pad_bot14">拍摄照片</div>
        <camera @getFile="getFile" :errorMsg="errorMsg" ref="camera"></camera>
      </template>
    </a-form>
  </div>
</template>

<script>
import { cardIdReg, nameReg } from '@/utils/reg'
import Camera from '@/components/Camera/Index'
import { papersContrast, doUserCertification } from '@/api/authentication'
export default {
  name: 'StatusCertifications',
  props: {
    tenantInfo: {
      type: Object,
      default: () => {
        return {}
      }
    },
    orderId: {
      type: Number,
      default: 0
    }
  },
  components: {
    Camera
  },
  data () {
    return {
      certificationsForm: this.$form.createForm(this),
      cardIdReg,
      nameReg,
      file: '',
      errorMsg: ''
    }
  },
  created () {
  },
  methods: {
    getFile (file) {
      if (file) {
        this.file = file
        this.errorMsg = ''
      } else {
        this.file = ''
        this.errorMsg = '请拍摄照片！'
      }
    },
    handleReset () {
      this.certificationsForm.resetFields()
    },
    /**
     * 设置身份验证参数
     * Parame formData
     */
    setCertificationParameter (formData) {
      formData.append('orderId', this.orderId)
      formData.append('tenantId', this.tenantInfo.tenaneId)
      formData.append('lxdh', this.tenantInfo.lxdh)
      formData.append('zklx', this.tenantInfo.zklx)
      return formData
    },
    handleSubmit () {
      return new Promise((resolve, reject) => {
        // e.preventDefault()
        this.certificationsForm.validateFieldsAndScroll(async (err, values) => {
          let falg = true
          if (!this.file) {
            this.errorMsg = '请拍摄照片！'
            falg = false
          } else {
            this.errorMsg = ''
            falg = true
          }
          if (!err && falg) {
            const faceImg = this.$refs.camera.postSubmitPicturesData()
            const formDataPapers = new FormData()
            formDataPapers.append('sfz', values.zjhm)
            formDataPapers.append('xm', values.zkxm)
            formDataPapers.append('faceImgs', faceImg[1])
            await papersContrast(formDataPapers).then((res) => {
              const data = res.data
              // 租客信息插入时需要需要file类型图片，所以删掉base64图片
              formDataPapers.delete('faceImgs')
              formDataPapers.append('faceImg', faceImg[0])
              const formDataCertification = this.setCertificationParameter(formDataPapers)
              formDataCertification.append('zjzl', values.zjzl)
              formDataCertification.append('zjhm', values.zjhm)
              if (data && data.result === '2') {
                // 获取身份验证参数
                formDataCertification.append('zkxm', values.zkxm)
                formDataCertification.append('yzjg', '通过')
                doUserCertification(formDataCertification).then((returned) => {
                  resolve(returned)
                }).catch((err) => {
                  console.log(err)
                  reject(err)
                })
              } else {
                formDataCertification.append('zkxm', this.tenantInfo.zkxm)
                formDataCertification.append('yzjg', '不通过')
                this.$confirm({
                  title: '认证失败',
                  content: '需要提交人工验证吗？',
                  onOk () {
                    doUserCertification(formDataCertification).then((returned) => {
                      returned.status = 2
                      resolve(returned)
                    }).catch((er) => {
                      reject(er)
                    })
                  },
                  onCancel () {
                    reject(data)
                  }
                })
              }
            }).catch((error) => {
              console.log(error)
              reject(error)
            })
          } else {
            reject(err)
          }
        })
      })
    }
  }
}
</script>

  <style less scoped>
    .title {
      width: 56px;
      height: 16px;
      font-size: 14px;
      font-weight: 700;
      color: rgba(51, 51, 51, 1);
      line-height: 16px;
      margin-bottom: 22px;
    }
  </style>
